<template>
	<view>
		<swiper :autoplay="data.autoplay" @change="$emit('hide',$event)" circular="true" class="goods-image-swiper" duration="300" indicatorActiveColor="#ff5c5c" indicatorDots="true" interval="5000">
    <swiper-item v-for="(item,index) in data.goods.pic_list" :key="item.id">
        <image @tap="$emit('onGoodsImageClick',$event)" class="goods-image" :data-index="index" mode="aspectFill" :src="item"></image>
        <image @tap="$emit('play',$event)" :class="['play', data.img_hide]" :data-url="data.goods.video_url" :src="data.__wxapp_img.dapp.video_play.url" v-if="data.goods.video_url"></image>
        <view class="flex-row flex-y-center share_commission" v-if="data.__is_share_price&&data.goods.max_share_price>0&&data.goods.is_negotiable!=1&&data.goods.is_share">
            <image class="img" :src="data.__wxapp_img.dapp.share_commission.url"></image>
            <view class="flex-col text_box">
                <text class="text1">分销最高可赚</text>
                <text class="text2">￥{{data.goods.max_share_price}}</text>
            </view>
        </view>
    </swiper-item>
</swiper>

	</view>
</template>

<script>var myVue = {};
	export default {
		props:{
			data: {
				type: Object,
				default: function(){
					return {}
				}
			}
		},
		data() {
			return {
			};
		},
	}
</script>

<style scoped>
.goods-image-swiper {
    height: 708upx;
    position: relative;
}

.goods-image-swiper image {
    height: 708upx;
}

.goods-image {
    width: 100%;
    height: 100%;
}

.share_commission {
    height: 80upx;
    /* width: 220upx; */
		padding-right: 10upx;
    position: absolute;
    right: 0;
    bottom: 80upx;
    border-top-left-radius: 40upx;
    border-bottom-left-radius: 40upx;
    background-color: rgba(0,0,0,0.4);
}

.share_commission .img {
    width: 44upx;
    height: 44upx;
    margin-right: 14upx;
    margin-left: 20upx;
}

.share_commission .text_box {
    font-size: 7pt;
    color: #fff;
}

.share_commission .text2 {
    font-weight: bold;
}

.goods-image-swiper .play {
    width: 150upx;
    height: 150upx;
    position: absolute;
    top: 275upx;
    left: 300upx;
}
</style>
